Skip to content

fix(mobile): chat layout collapses after returning from background - #6284

Open
LiaoyuanNing wants to merge 1 commit into
multica-ai:mainfrom
LiaoyuanNing:age-365-chat-keyboard-resume
Open

fix(mobile): chat layout collapses after returning from background#6284
LiaoyuanNing wants to merge 1 commit into
multica-ai:mainfrom
LiaoyuanNing:age-365-chat-keyboard-resume

Conversation

@LiaoyuanNing

@LiaoyuanNing LiaoyuanNing commented Aug 2, 2026

Copy link
Copy Markdown
Contributor

Summary

Fix the mobile Chat layout that can collapse after the app returns from the background while a multiline draft has the keyboard open.

The affected screen used React Native's event-driven KeyboardAvoidingView. When iOS dismissed the keyboard while JavaScript was inactive, the final keyboardWillHide event could be missed or not applied, leaving a large bottom padding on resume. That stale padding consumed the container height: the message list's flex: 1 area collapsed toward zero and the composer was pushed upward and compressed.

Chat now uses the KeyboardAvoidingView from react-native-keyboard-controller. The root KeyboardProvider is already mounted, so this introduces no dependency. Its padding derives from native keyboard state rather than delivery of JavaScript keyboard events, so a background dismissal cannot leave the stale offset behind.

Reproduction

  1. Open Chat and type enough text to expand the composer.
  2. Without sending, switch to another app or return to the home screen while the keyboard is open.
  3. Return to the app.

Before this change, the composer could collapse below the header with overlapping text and toolbar controls while the message list became blank.

Before After
Collapsed composer and blank message list Normal composer and message list

Scope and follow-up

This is deliberately Chat-only: it fixes the reported expanded-composer layout without changing unrelated form screens. new-issue.tsx, search.tsx, project/new.tsx, issue/[id]/edit.tsx, login.tsx, and verify.tsx use the same React Native KeyboardAvoidingView pattern, so they may have the same failure mode; they have not been individually verified. A follow-up could standardize those screens if maintainers want the wider change.

Validation

  • pnpm --filter @multica/mobile typecheck
  • pnpm --filter @multica/mobile lint (passes with 7 pre-existing warnings)
  • pnpm --filter @multica/mobile test (42 tests passed)
  • Verified the three-step recovery path on a physical device with TestFlight build 5 of a self-hosted internal build.

@vercel

vercel Bot commented Aug 2, 2026

Copy link
Copy Markdown

@LiaoyuanNing is attempting to deploy a commit to the IndexLabs Team on Vercel.

A member of the Team first needs to authorize it.

@LiaoyuanNing LiaoyuanNing changed the title AGE-365: recover chat keyboard layout after app resume fix(mobile): chat layout collapses after returning from background Aug 2, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant